<!DOCTYPE html>
<html class="ui-page-login">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="Access-Control-Allow-Origin" content="">
		<meta http-equiv="content-security-policy">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/style.css" rel="stylesheet" />
		<script src="../js/mui.min.js"></script>
		<style>
			.area {
				margin: 20px auto 0px auto;
			}
			.mui-input-group:first-child {
				margin-top: 20px;
			}
			.mui-input-group label {
				width: 22%;
			}
			.mui-input-row label~input,
			.mui-input-row label~select,
			.mui-input-row label~textarea {
				width: 78%;
			}
			.mui-checkbox input[type=checkbox],
			.mui-radio input[type=radio] {
				top: 6px;
			}
			.mui-content-padded {
				margin-top: 25px;
			}
			.mui-btn {
				padding: 10px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">注册</h1>
		</header>
		<div class="mui-content">
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>账号</label>
					<input id='account' type="text" class="mui-input-clear mui-input" placeholder="请输入账号">
				</div>
				<div class="mui-input-row">
					<label>密码</label>
					<input id='password' type="password" class="mui-input-clear mui-input" placeholder="请输入密码">
				</div>
				<div class="mui-input-row">
					<label>确认</label>
					<input id='password_confirm' type="password" class="mui-input-clear mui-input" placeholder="请确认密码">
				</div>
				<div class="mui-input-row">
					<label>邮箱</label>
					<input id='email' type="email" class="mui-input-clear mui-input" placeholder="请输入邮箱">
				</div>
			</form>
			<div class="mui-content-padded">
				<button id='reg' class="mui-btn mui-btn-block mui-btn-primary">注册</button>
			</div>
			<div class="mui-content-padded">
				<p style="text-align: center;">个人注册后需要到管理员处修改个人信息</p>
			</div>
		</div>
		<script>
			(function($, doc) {
				$.init();
				//初始化，并预加载webview模式的选项卡			
				function preload () {
					mui.preload({
						id:'dash',
						url:'templates/dash.html',
						styles: {
							popGesture: 'hide'
						}
					});
				}
				
				$.plusReady(function() {
					//var settings = app.getSettings();
					var regButton = doc.getElementById('reg');
					var accountBox = doc.getElementById('account');
					var passwordBox = doc.getElementById('password');
					var passwordConfirmBox = doc.getElementById('password_confirm');
					var emailBox = doc.getElementById('email');
					regButton.addEventListener('tap', function(event) {
						var regInfo = {
							account: accountBox.value,
							password: passwordBox.value,
							email: emailBox.value
						};
						if(regInfo.account.length == 0){
							mui.toast("请输入用户名");
							return;
						}
						var passwordConfirm = passwordConfirmBox.value;
						if (passwordConfirm != regInfo.password) {
							plus.nativeUI.toast('密码两次输入不一致');
							return;
						}
						if(regInfo.email.length == 0){
							mui.toast("请输入邮箱");
							return;
						}
						var storage = window.localStorage;
						var root = storage.getItem("root");
						var data = {
								"phone":regInfo.account,
								"pwd":regInfo.password,
								"email":regInfo.email
						};
						data = JSON.stringify(data);
						mui.ajax(root+'/user/regist', {
							data:data,
							contentType:"application/json;charset=UTF-8",
							dataType:"json",//服务器返回json格式数据
							type:"post",//HTTP请求类型
							timeout:10000,//超时时间设置为10秒；
							success:function(data){
								//服务器返回响应，根据响应结果，分析是否登录成功；
								if(data.states == 'OK'){
									storage.setItem('id', data.user.id);
									storage.setItem('name', data.user.name);
									storage.setItem('position', data.user.position);
									storage.setItem('birthday', data.user.birthday);
									storage.setItem('startworkdate', data.user.startworkdate);
									storage.setItem('department', data.user.department);
									storage.setItem('gender', data.user.gender);
									storage.setItem('pwd', data.user.pwd);
									storage.setItem('phone', data.user.phone);
									mui.plusReady(function() {
										//延迟的原因：优先打开启动导航页面，避免资源争夺
										setTimeout(function () {
											//预加载
											preload();
										},200);
										
										mui.openWindow({
											url:'dash.html',
											id:'dash.html',
											createNew:false,
										});
										mui.toast('注册成功');
									});
								}else{
									mui.toast('注册失败');
								}
							},
							error:function(xhr,type,errorThrown){
								//异常处理；
								console.log(xhr,type,errorThrown);
								mui.toast('网络异常');
							}
						});
					
					});
				});
			}(mui, document));
		</script>
	</body>

</html>